import React from 'react';
import 'antd/dist/antd.min.css';
import { Form, Input, Button, Tooltip, Select } from 'antd';
import { Navigate } from 'react-router-dom'
const { Option } = Select;
class SubmitInfo extends React.Component {
  // validatePhoneNumber(number) {
  //   var patrn = /^1[3456789]\d{9}$/;
  //   if(patrn.test(number)){
  //     return {
  //       validateStatus: 'success',
  //       errorMsg: null,
  //     };
  //   }

  //   return {
  //     validateStatus: 'error',
  //     errorMsg: 'wrong formate of phone num!',
  //   };
  // }
  render() {
    if (typeof this.props.address === 'undefined')
      return <Navigate to='/' />
    else
      return (<div>
        {/* <Modal title="Basic Modal" visible={typeof this.state.address === 'undefined'} >
          <p>清连接到metamask账户</p>
        </Modal> */}
        <Tooltip title="prompt text">
          认证中心信息填写
        </Tooltip>
        <Form
          name="basic"
          initialValues={{
            remember: true,
          }}
          labelCol={{ span: 4 }}
          wrapperCol={{ span: 4 }}
          onFinish={(values) => {
            console.log(values);
            console.log(typeof values);
            values.address = this.props.address;
            this.props.axios.post('/submit', values);
          }}
          onFinishFailed={(errors) => {
            console.log(errors);
          }}
          autoComplete="true"
        >
          <Form.Item
            label="用户名"
            name="username"
            rules={[{
              required: true,
              message: '请输入用户名!',
            },
            ]}
          >
            <Input />
          </Form.Item>
          <Form.Item
            label="性别"
            name="sex"
            rules={[
              {
                required: true,
                message: '请输入性别!',
              },
            ]}
          >
            <Select>
              <Option value="男">男</Option>
              <Option value="女">女</Option>
            </Select>
          </Form.Item>

          <Form.Item
            label="电话"
            name="phoneNum"
            rules={[
              {
                required: true,
                message: '请输入电话号码!',
              },
            ]}
          >
            <Input />
          </Form.Item>

          <Form.Item
            wrapperCol={{
              offset: 4,
              span: 16,
            }}
          >
            <Button type="primary" htmlType="submit">
              Submit
            </Button>
          </Form.Item>
        </Form>
      </div>)
  }
}
export default SubmitInfo;